<template>
	<view class="pl30 pr30">

		<!-- <view class="flex pb30 pt30 u-border-bottom" v-for="(item,i) in list" :key='i' @click="$jump(item.url)"> -->

		<view class="flex pb30 pt30 u-border-bottom" @click="jump(item.url)" v-for="(item,i) in list" :key='i'>

			<!-- 左边的图片 -->
			<image :src="item.image" class="w90 h90 mr30"></image>
			<view class="flex col-center row-between flex1">
				<view class="flex row-column row-between h-max">
					<text class="fs28 fw">{{item.tit}}</text>
					<text class="color9 fs24">{{item.msg}}</text>
				</view>
				<view class="flex">
					<view v-show="i == 1 && messageCount > 0" class="w30 h30 radius30 bg-them text-center fs20 color-f mr20" style="line-height: 30rpx;">{{messageCount}}</view>
					<u-icon name="arrow-right" color="#999999"></u-icon>
				</view>
			</view>
		</view>
		<!-- <web-view :webview-styles="webviewStyles" src="https://chatlink-new.meiqia.cn/widget/standalone.html?eid=139427ed6c328fcc96321d1af30f35cf"></web-view> -->
	</view>
</template>

<script>
	export default {
		data() {	
			return {
				list:[{
					image:'/static/image/index/msg1.png',
					tit:"系统公告",
					msg:'第一时间接收系统消息',
					url:'/pages/home/notice/index'
				},{
					image:'../../static/image/index/msg2.png',
					tit:"消息通知",
					msg:'第一时间接收消息通知',
					url: '/pages/msg/list'
				}],
				messageCount: 0
			};
		},
		onShow() {
			this.getData()
		},
		methods:{
			getData () {
				this.$api.messageCount().then(res => {
					this.messageCount = res.data
				})
			},
			jump (url) {
				uni.navigateTo({
					url: url
				})
			}
		}
	}
</script>

<style lang="scss">

</style>
